import React, { useEffect, useState } from "react";
import '../../css/lmy/Lmy.css'
import { LeftOutline } from 'antd-mobile-icons'
import { useNavigate } from "react-router-dom";
import instance from "../../request/request";
const Lourself = ()=>{
    const navigate =useNavigate()
    const [data,setData] = useState({})
    const [inputValueName,setInputValueName] = useState('')
    const [inputValue1,setInputValue1] = useState('')
    const [inputValueDate,setInputValueDate] = useState('')
    const [inputValueEmail,setInputValueEmail] = useState('')
    const [inputValueJi,setInputValueJi] = useState('')
    const [inputValuePhone,setInputValuePhone] = useState('')
    const [inputValueSex,setInputValueSex] = useState('')
    const [inputValueImg,setInputValueImg] = useState('')
    function getData(){
        instance.get('/lLogin',{
            params:{
                lemail:localStorage.getItem('lemail'),
                lphone:localStorage.getItem('lphone')
            }
        }).then(res=>{
            console.log(res.data)
            if(res.data.code===200){
                setData(res.data.data)
            }
        })
    }
    useEffect(()=>{
        getData()
    },[])
    return(
        <>
            <div className="lourselfBox">
                <div>
                    <h3 className="lourselfHead"><LeftOutline onClick={()=>{
                        navigate('/tar/lmy')
                    }} />
                    &nbsp;
                    个人信息</h3>
                </div>
                <div className="lourselfinput">
                    <input
                    placeholder={data.name}
                    type="text"
                    value={inputValueName}
                    onChange={(e)=>{
                        setInputValueName(e.target.value)
                    }}
                    
                    />
                </div>
                <div className="lourselfinput">
                    <input
                    placeholder={data.title}
                    type="text"
                    value={inputValue1}
                    onChange={(e)=>{
                        setInputValue1(e.target.value)
                    }}
                    />
                </div>
                <div className="lourselfinput">
                    <input
                    placeholder={data.time}
                    type="text"
                    value={inputValueDate}
                    onChange={(e)=>{
                        setInputValueDate(e.target.value)
                    }}
                    />
                </div>
                <div className="lourselfinput">
                    <input
                    placeholder={data.email}
                    type="text"
                    value={inputValueEmail}
                    onChange={(e)=>{
                        setInputValueEmail(e.target.value)
                    }}
                    />
                </div>
                {/* <div className="lourselfinput">
                    <input
                    placeholder={data.address}
                    type="text"
                    value={inputValueJi}
                    onChange={(e)=>{
                        setInputValueJi(e.target.value)
                    }}
                    />
                </div> */}
                <div className="lourselfinput">
                    <input
                    placeholder={data.phone}
                    type="text"
                    value={inputValuePhone}
                    onChange={(e)=>{
                        setInputValuePhone(e.target.value)
                    }}
                    />
                </div>
                <div className="lourselfinput">
                    <input
                    placeholder={data.sex}
                    type="text"
                    value={inputValueSex}
                    onChange={(e)=>{
                        setInputValueSex(e.target.value)
                    }}
                    />
                </div>
                <div className="lourselfinput">
                    <input
                    placeholder={data.img}
                    type="text"
                    value={inputValueImg}
                    onChange={(e)=>{
                        setInputValueImg(e.target.value)
                    }}
                    />
                </div>
                <div>
                    <button className="lourselrButton" onClick={()=>{
                        localStorage.setItem('lemail',inputValueEmail.length>0?inputValueEmail:data.email)
                        localStorage.setItem('lphone',inputValuePhone.length>0?inputValuePhone:data.phone)
                        // 处理更新逻辑
                        const obj = {
                            _id:data._id,
                            name:inputValueName.length>0?inputValueName:data.name,
                            title:inputValue1.length>0?inputValue1:data.title,
                            time:inputValueDate.length>0?inputValueDate:data.time,
                            email:inputValueEmail.length>0?inputValueEmail:data.email,
                            address:inputValueJi.length>0?inputValueJi:data.address,
                            phone:inputValuePhone.length>0?inputValuePhone:data.phone,
                            img:inputValueImg.length>0?inputValueImg:data.img,
                            // address:data.address
                        }
                        instance.put('/lput',obj).then(res=>{
                            getData()
                        })
                        //跳转个人页面
                        navigate('/tar/lmy')
                    }}>更新</button>
                </div>
            </div>
        </>
    )
}

export default Lourself
